{% extends "user/user_base.html" %}

{% block primary %}

    <div class="primary">
        <div class="item watched-repos">
        <h2 class="heading">关注仓库</h2>
        <ul class="list">
        {% for watch_repo in watch_repos %}
            <li class="cl_watch_repo_tr" data-repo-id="{{watch_repo.id}}">
                <h3 class="heading">
                    <a href="/{{watch_repo.username}}/{{watch_repo.name}}/">{{watch_repo.name}}</a>
                </h3>
                <p>{{watch_repo.desc}}</p>
                <div class="actions">
                    <span id="id_repo_{{watch_repo.id}}" data-repo-id="{{watch_repo.id}}" class="btn btn-mini btn-warning btn-unwatch">取消关注</span> 
                    {% if watch_repo.visibly != 0 %}
                        <span class="label label-mini label-important">已经删除</span> 
                    {% endif %}
                    {% if watch_repo.auth_type == 2 %}
                        <span class="label label-mini label-inverse">私有仓库</span>
                    {% endif %}
                </div>
            </li>
        {% endfor %}
        </ul>
    </div>
</div>
{% endblock %}
{% block subjs %}
<script>
/*global jQuery, window */
$(function(){
    $('.cl_watch_repo_tr').bind('mouseover mouseout', function(event) {
        if (event.type == 'mouseover') {
            var repo_id = $(this).attr('data-repo-id');
            $('#id_repo_'+repo_id).show();
        } else {
            var repo_id = $(this).attr('data-repo-id');
            $('#id_repo_'+repo_id).hide();
        }
    });
    $('.button-unwatch').click(function(){
        var repo_username = $(this).attr('data-repo-username');
        var repo_name = $(this).attr('data-repo-name');
        var action_url = '/' + repo_username + '/' + repo_name + '/unwatch/';
        $.ajax({
            url: action_url,
            type: 'POST',
            data: {csrfmiddlewaretoken: '{{ csrf_token }}'},
            dataType: 'json',
            timeout: 10000,
            error: function(){
                window.location = window.location
            },
            success: function(json){
                window.location = window.location
            },
        })
    });
});
</script>
{% endblock %}
